<template>
    <div>
        <van-sticky>
            <van-nav-bar title="缴费记录" left-text="返回" left-arrow @click-left="onClickLeft" />
        </van-sticky>
        <div class="list">
            <div class="listOne" v-for="item in recordLsit" :key="item.id">
                <div class="icons">
                    <img :src="'http://218.7.112.123:10001/'+item.imgUrl" alt="">
                    <span>{{item.liveName}}</span>
                </div>
                <div class="amount">缴费金额: <i>{{item.amount}}元</i> </div>
                <div class="payType">支付方式: {{item.paymentType}}</div>
                <div class="payTime">支付时间: {{item.rechargeTime}}</div>
            </div>
        </div>
    </div>
</template>
<script>
import nav from "@/mixin/nav";
import { payRecord } from "@/service/living/linvingService";
export default {
    mixins: [nav],
    data() {
        return {
            recordLsit: [],
        }
    },
    methods: {
        onClickLeft() {
            this.$router.go(-1);
        }
    },
    async created() {
        let { data } = await payRecord();
        console.log(data);
        this.recordLsit = data.rows;
    }
}

</script>
<style scoped lang="scss">
.list {
    padding: 10px;

    .listOne {
        padding: 10px;
        border-bottom: 1px solid #EDEDED;

        .icons {
            height: 30px;
            display: flex;
            align-items: center;
            margin-bottom: 20px;

            img {
                height: 100%;
            }

            span {
                margin-left: 20px;
                font-size: 20px;
            }
        }
        .amount {
            i {
                font-size: 20px;
                color: red;
            }
        }
    }
}
</style>